import Vue from 'vue'
import Vuex from 'vuex'
import api from '@/api/index'
Vue.use(Vuex)

export default new Vuex.Store({
  // / 存状态的地方 他的数据是响应式的
  state: {
    getEnterpirseInfo: {},
    goodsList: [],
    goods:''
  },

  // vuex的计算属性  基于sate衍生数据  源数据改变则跟着改变

  getters: {
    getters_SHOP_CAR_LIST({ goodsList }): any {
      const arr: Array<any> = []
      goodsList.forEach((item: any) => {
        item.foods.forEach((_item: any) => {
          if (_item.num > 0) {
            arr.push(_item)
          }
        })
      })
      return arr
    },
    // 计算总价
    getters_TOTAL_MONEY({ goodsList }, getters): number {
      if (getters.getters_SHOP_CAR_LIST.length) {
        let total = 0
        getters.getters_SHOP_CAR_LIST.forEach((item: any) => {
          total += item.num * item.price
        })
        return total
      } else {
        return 0
      }
    },
    // 计算总数量
    getters_TOTAL_number({ goodsList }, getters): number {
      if (getters.getters_SHOP_CAR_LIST.length) {
        let total = 0
        getters.getters_SHOP_CAR_LIST.forEach((item: any) => {
          total += item.num 
        })
        return total
      } else {
        return 0
      }
    },



  },
// 更新数据
  mutations: { 
    //  详情页商品信息
    GET_GOODS_DETAIL(state,payload){
      state.goods=payload
    },

    // 更新商品列表
    SET_GOODSLIST(state, payload) {
      state.goodsList = payload
      console.log(state.goodsList);

    },
    EnterpriseInfo_UPDATE(state, payload) {
      state.getEnterpirseInfo = payload
    },
    // 增加商品到购物车
    /* 
    params {id, num}
    */
    ADD_GOOD_TOCAR({ goodsList }, params) {
      //  将goodslist结构出来   循环根据id识别 再将num叠加到num属性中 
      goodsList.forEach((item: any) => {
        item.foods.forEach((food: any) => {
          if (food.id === params.id) {
            food.num += params.num
          }
        })
      })

    }
  },
  actions: {// actions本身是一个函数，可以进行异步操作 比如后端API调用 context是store本身
    UPDATE_GOODLIST(content, payload) {
      console.log(payload);
      // 调用接口
      console.log(content);

      api.getGoodsList().then((res: any) => {
        const { goodsList } = res.data

        // 拿到商品列表之后，遍历添加一个num属性，保存用户选择是数量
        goodsList.forEach((item: any) => {
          item.foods.forEach((foods: any) => {
            foods.num = 0 //给所有商品添加一个bum属性 
          })
        })
        //  将添加好的数据  用vuex方法更新到 state中
        content.commit('SET_GOODSLIST', goodsList)
      })
    }
  },
  modules: {
  }
})
